<template>
    <el-select clearable v-model="selected" placeholder="请选择">
        <el-option
                v-for="item in options"
                :key="item.detailKey"
                :label="item.detailValue"
                :value="item.detailKey">
        </el-option>
    </el-select>
</template>

<script>
    export default {
        name: "standardizedSelect",
        props:{
            codeName: String,
            value: String
        },
        data(){
          return {
              selected: '',
              options: []
          }
        },
        watch:{
            selected(val, oldVal){
               if (val != oldVal){
                   this.$emit('input', this.selected);
               }
            }
        },
        methods:{
            async getCodeByName(codeName) {
                let data = await this.$http({
                    url: `/system/codes/${codeName}`,
                    method: 'GET',
                })
                return data;
            }
        },
        async mounted() {
            this.selected = this.value;
            this.options = await this.getCodeByName(this.codeName);
        }
    }
</script>

<style scoped>

</style>